<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>登录</title>
    <link rel="stylesheet" type="text/css" href="/static/css/resources/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="/static/css/stylesheets/login.css"/>
    <script type="text/javascript" src="/static/js/resources/jquery.min.js"></script>
    <script src="/static/js/resources/bootstrap.min.js"></script>
    <script src="/static/js/resources/bootstrapValidator.js"></script>
    <script type='text/javascript' src='/static/js/animation/jquery.particleground.min.js'></script>
    <script type='text/javascript' src='/static/js/animation/demo.js'></script>
</head>
<body>
<div class="container-box">
    <div class="header">
        <img src="/static/images/login/logo.png">
        <span class="logo-txt">SC Blog</span>
    </div>
    <div class="content" id="particles">
        <div class="login-box">
            <span class="tit-text">管理员</span>

            <form id="login-form" th:action="@{/admin/login}" th:object="${admin}" class="form-horizontal" method="post">
                <div class="input-box">
                    <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label">用户</label>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" id="inputEmail3" placeholder="请输入用户名称"  name="username"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label">密码</label>
                        <div class="col-sm-10">
                            <input type="password" class="form-control" id="inputPassword3" placeholder="请输入密码" name="password"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-10">
                            <button id="login-btn" type="submit" class="btn btn-default login-btn">登录</button>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>


    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h4 class="modal-title" id="myModalLabel">Modal title</h4>
                </div>
                <div class="modal-body">
                    <p id="result" data-result=""></p>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-default" data-dismiss="modal" id="close-btn">关闭</button>
                </div>
            </div>
        </div>
    </div>





    <div class="footer">
        <span>© 2016 SC Blog 版权所有</span>
    </div>
</div>

<script type="text/javascript">
    jQuery(document).ready(function () {
        $('#login-form')
                .bootstrapValidator({
                    message: '这个值无效',
                    //live: 'submitted',
                    feedbackIcons: {
                        valid: 'glyphicon glyphicon-ok',
                        invalid: 'glyphicon glyphicon-remove',
                        validating: 'glyphicon glyphicon-refresh'
                    },
                    fields: {
                        username: {
                            validators: {
                                notEmpty: {
                                    message: '用户名不能为空'
                                }
                            },
                            stringLength: {
                                min: 5,
                                max: 30,
                                message: '用户名长度大于5小于30'
                            }
                        },
                        password: {
                            validators: {
                                notEmpty: {
                                    message: '密码不能为空'
                                },
                                stringLength: {
                                    min: 5,
                                    max: 30,
                                    message: '密码长度大于5小于30'
                                }
                            }
                        }
                    }
                })
                .on('success.form.bv', function (e) {

                });
    });

</script>

<!--<script type="text/javascript">-->
    <!--var login_btn = $("#login-btn");-->
    <!--var login_form = $("#login-form");-->
    <!--var modal = $("#myModal");-->
    <!--var modal_result = $("#result");-->
    <!--var isSuccess = false;-->
    <!--$("#close-btn").bind("click", function () {-->
        <!--if (isSuccess){-->
            <!--window.location = "/index";-->
        <!--}-->
    <!--});-->
    <!--login_btn.click(function (e){-->
        <!--e.preventDefault();-->
        <!--$.ajax({-->
            <!--url: "/login",-->
            <!--data: login_form.serializeArray(),-->
            <!--type: 'POST',-->
            <!--success: function(data){-->
                <!--var result = $.parseJSON(data);-->
                <!--modal_result.text(result.reason);-->
                <!--isSuccess = result.isSuccess;-->
                <!--modal.modal('show');-->
            <!--}-->
        <!--})-->
    <!--})-->
<!--</script>-->

</body>